import { createApp } from 'vue'
import App from './App.vue'
import router from './router/index'
import "@/style/global.scss"

import 'amfe-flexible'
// import Vant from 'vant'
// import 'vant/lib/index.css'

import ElementPlus from 'element-plus';
import 'element-plus/dist/index.css';


// if (import.meta.env.VITE_USER_NODE_ENV !== 'production') {
//   // 如果不是生产环境 就加载vconsole
//   import('vconsole').then(VConsole => {
//     new VConsole.default();
//   });
// }


import { onMounted } from 'vue';
import { getGlobalStyles } from './services/globalStyles';

onMounted(async () => {
    const globalStyles = await getGlobalStyles();
    if (globalStyles) {
        document.documentElement.style.setProperty('--global-font-size', `${globalStyles.fontSize}px`);
        document.documentElement.style.setProperty('--global-font-color', globalStyles.fontColor);
    }
});


// 定义 buttonClickHandler 函数
function buttonClickHandler(event, buttonInfo, vnode) {
    console.log('Button clicked:', event, buttonInfo, vnode);
  }

// 自定义指令 v-buttons
const vButtons = {
    mounted(el, binding, vnode) {
      // 假设 binding.value 是一个包含按钮信息的数组
      const buttons = binding.value;
  
      // 创建并添加按钮到 DOM
      buttons.forEach(buttonInfo => {
        const button = document.createElement('button');
        button.innerText = buttonInfo.label;
        button.className = buttonInfo.class || '';
  
        // 监听按钮的点击事件
        button.addEventListener('click', (event) => {
          buttonClickHandler(event, buttonInfo, vnode);
        });
  
        el.appendChild(button);
      });
    }
  };
  

const app = createApp(App)
app.use(router)
// app.use(Vant)
app.use(ElementPlus);

// 注册自定义指令
app.directive('buttons', vButtons);

app.mount('#app')


